
        
        .shave{
            position: fixed;
            width:100%;
            height: 100%;
            background: rgb(250,250,250);
            top:0px;

        }
        body>.container{
            position: relative;
            z-index: 2;
        }
        
        
        main .recruit{
            padding-top:120px;
        }
        main .recruit .sideNav{
            position: absolute;
            top: 130px;
            right: 0px;
            transform: translateY(-100%);
        }
        main .recruit .sideNav a{
            font-weight: bold;
            font-size: 20px;
        }
        main .recruit .sideNav a + a{
            margin-left: 6.25vw;
        }
        main .recruit .sideNav a .line{
            margin-right: 20px;
            transition: transform ease .5s;
            background: #000;
        }
        main .recruit .sideNav a.current .line,
        main .recruit .sideNav a:hover .line{
            transform: rotate(-30deg);
        }
        main .recruit .contn{
            margin-top:120px;
        }

        
        main .recruit .emplyList .item .itemHead{
            background: rgba(255,255,255,.8);
            font-size: 24px;
            padding: 45px 0px;
            overflow: hidden;
            cursor: pointer;
            transition-property: background , color;
            transition-duration: .5s;
        }
        main .recruit .emplyList .item.name .itemHead{
            background: transparent;
            padding-top: 0px;
            font-size: 24px;
        }
        main .recruit .emplyList .item.postn.clicked .itemHead,
        main .recruit .emplyList .item.postn:hover .itemHead{
            background: #54300a;
            color: #fff;
        }
        main .recruit .emplyList .item .itemHead .lft,
        main .recruit .emplyList .item .itemHead .rht{
            width: 50%;
            float: left;
        }
        main .recruit .emplyList .item .itemHead .lft>*{
            width: 40%;
        }
        main .recruit .emplyList .item .itemHead>*>*:nth-child(2){
            width: 20%;
        }
        main .recruit .emplyList .item .itemHead>*>*:first-child{
            padding-left: 30px;
        }
        main .recruit .emplyList .item .itemHead .rht{
            justify-content: space-between;
        }
        main .recruit .emplyList .item.postn .itemHead{
            border: 1px solid #858585;
            overflow: hidden;
        }
        main .recruit .emplyList .item.postn + .item.postn{
            margin-top: 25px;
        } 
        main .recruit .emplyList .item.name .itemHead{
            background: transparent;
            padding-top: 0px;
            font-size: 30px;
            border-width: 0px;
            cursor: default;
        }
        main .recruit .emplyList .item.postn.clicked .itemHead,
        main .recruit .emplyList .item.postn .itemHead:hover{
            background: #543a00;
            color: #fff;
        }
        
        main .recruit .emplyList .item .itemHead .lft,
        main .recruit .emplyList .item .itemHead .rht{
            width: 50%;
            float: left;
        }
        main .recruit .emplyList .item .itemHead .lft>*{
            width: 40%;
        }
        main .recruit .emplyList .item .itemHead>*>*:nth-child(2){
            width: 20%;
        }
        main .recruit .emplyList .item .itemHead>*>*:first-child{
            padding-left: 30px;
        }
        main .recruit .emplyList .item .itemHead .rht{
            justify-content: space-between;
        }
        main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2){
            color: #543a00;
            transition:  ease color .5s;
        }
        main .recruit .emplyList .item.postn .itemHead:hover .rht>*:nth-child(2),
        main .recruit .emplyList .item.postn.clicked .itemHead .rht>*:nth-child(2){
            color: #fff;
        }
        main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2) .marks{
            width: 12px;
            height: 12px;
            position: relative;
            margin-right: 2px;
        }
        main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2) .marks i{
            position: absolute;
            background: #543a00;
            transition: top ease 1s,background ease .5s,opacity ease 1s;
        }
        main .recruit .emplyList .item.postn .itemHead:hover .rht>*:nth-child(2) .marks i,
        main .recruit .emplyList .item.postn.clicked .itemHead .rht>*:nth-child(2) .marks i{
            background: #fff;
        }
        main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2) .marks i:first-child{
            width: 100%;
            height: 1px;
            top: 50%;
            left: 0px;
            transform: translateY(-50%);
        }
        main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2) .marks i:last-child{
            height: 100%;
            width: 1px;
            left: 50%;
            top: 0px;
            transform: translateX(-50%);
        }
        main .recruit .emplyList .item.postn.clicked .itemHead .rht>*:nth-child(2) .marks i:last-child{
            top: -100%;
            opacity: 0;
        }
        main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2) .flip{
            position: relative;
        }
        main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2) .flip em{
            font-style: normal;
        }
        main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2) .flip em{
            transition: opacity 1s ease;
        }
        main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2) .flip em:last-child{
            position: absolute;
            top: 0px;
            left: 0px;
            opacity: 0;
        }
        main .recruit .emplyList .item.postn.clicked .itemHead .rht>*:nth-child(2) .flip em:first-child{
            opacity: 0;
        }
        main .recruit .emplyList .item.postn.clicked .itemHead .rht>*:nth-child(2) .flip em:last-child{
            opacity: 1;
        }
        main .recruit .emplyList .item.postn .details{
            overflow: hidden;
            transition: height ease .8s;
            height: 0px;
        }
        main .recruit .emplyList .item.postn .details .content{
            padding: 0px 30px;
            padding-top: 50px;
            padding-bottom: 20px;
            background: rgba(255,255,255,.8);
        }
        main .recruit .emplyList .item.postn .details .content p{
            font-weight: normal;
            font-size: 24px;
            transition-property: transform,opacity;
            opacity: 0;
            transform: translateY(20px);
            transition-duration: .4s;
        }
        main .recruit .emplyList .item.postn.clicked .details .content p{
            opacity: 1;
            transform: translateY(0px);
        }
        main .recruit .emplyList .item.postn .details .content p:not(.hidden) + p{
            margin-top: 45px;
        }
        main .recruit .emplyList .item.postn .details .content p span{
            font-weight: lighter;
            display: block;
            margin-top: 5px;   
            line-height: 150%;
        }

        .choosePage{
            padding-top: 50px;
            padding-bottom: 70px;
        }
        @media(max-width:1350px){
            main .recruit .emplyList .item.name .itemHead{
                font-size: 28px;
                padding-bottom: 40px;
            }
            main .recruit .emplyList .item .itemHead{
                padding:40px 0px;
                font-size: 22px;
            }
            main .recruit .emplyList .item.postn .details .content p{
                font-size: 22px;
            }
        }

        @media (max-width:1024px){
            main .recruit .sideNav{
                position: initial;
                margin-top: 80px;
                transform: initial;
            }
            main .recruit .sideNav a{
                font-size: 16px;
            }
            main .recruit .contn{
                margin-top: 60px;
            }
            main .recruit .emplyList .item.name .itemHead{
                font-size: 22px;
                padding-bottom: 25px;
            }
            main .recruit .emplyList .item .itemHead{
                padding:25px 0px;
                font-size: 16px;
            }
            main .recruit .emplyList .item .itemHead>*>*:first-child{
                padding-left: 20px;
            }
            main .recruit .emplyList .item.postn .details .content{
                padding-left: 20px;
                padding-right: 20px;
                padding-top: 35px;
            }
            main .recruit .emplyList .item.postn .details .content p{
                font-size: 16px;
            }
            main .recruit .emplyList .item.postn .details .content p:not(.hidden) + p{
                margin-top: 30px;
            }
            
        }
        @media (max-width:768px){
            main .recruit{
                padding-top: 100px;
            }
        }
        @media(min-width:768px){
            main .recruit .emplyList .item.postn .details .content p.hidden{
                display: none;
            }
        }
        .mobileDevice main .recruit .emplyList .item.postn .details{
            overflow: auto;
            max-height: 40vh;
        }
        .mobileDevice main .recruit .emplyList .item.postn .details::-webkit-scrollbar{
            width: 4px;
            height: 4px;
            border-radius: 50%;
        }
        .mobileDevice main .recruit .emplyList .item.postn .details::-webkit-scrollbar-thumb{
            background: #543a00;
        }
    
        .mobileDevice main .recruit .emplyList .item.postn .details::-webkit-scrollbar-track{
            border-radius: 10px;
            background: rgba(255,255,255,.8);
        }
        @media (max-width:767px){
            main .recruit .sideNav{
                margin-top: 50px;
                flex-direction: column;
            }
            main .recruit .sideNav a{
                font-size: 14px;
            }
            main .recruit .sideNav a + a{
                margin-left: 0px;
                margin-top: 10px;
            }
            
            main .recruit .emplyList .item.name .itemHead{
                font-size: 14px;
                padding-bottom: 20px;
            }
            main .recruit .emplyList .item .itemHead{
                padding:15px 0px;
                font-size: 12px;
            }
            main .recruit .emplyList .item .itemHead>*>*:first-child{
                padding-left: 10px;
            }
            main .recruit .emplyList .item.postn .itemHead .rht>*:nth-child(2) .marks{
                width: 8px;
                height: 8px;
            }
            main .recruit .emplyList .item.postn .details .content{
                padding: 20px 10px;
            }
            main .recruit .emplyList .item.postn .details .content p{
                font-size: 12px;
            }
            main .recruit .emplyList .item.postn .details .content p:not(.hidden) + p{
                margin-top: initial;
            }
            main .recruit .emplyList .item.postn + .item.postn,
            main .recruit .emplyList .item.postn .details .content p + p{
                margin-top: 15px !important;
            }

            main .recruit .emplyList .item .itemHead .lft{
                width: 67%;
                justify-content: space-between;
            }
            main .recruit .emplyList .item .itemHead .lft>*{
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 1;
                white-space: normal;
                word-break: break-all;
            }
            
            main .recruit .emplyList .item .itemHead .lft>*:nth-child(2),
            main .recruit .emplyList .item .itemHead .rht>*:first-child{
                display: none;
            }
            main .recruit .emplyList .item .itemHead .rht{
                width: 33%;
                justify-content: initial;
                text-align: right;
            }
            main .recruit .emplyList .item .itemHead .rht>*:nth-child(2){
                padding-right: 10px;
                flex: 1;
                justify-content: flex-end;
            }
        }

